<html>
	<head>
		<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
		<title>BlackStar Monitor&amp;Profile System</title>
		<meta http-equiv="pragma" content="no-cache" />
		<link rel="stylesheet" type="text/css"
			href="/static/extjs/resources/css/ext-all.css" rel="stylesheet" />
		<script type="text/javascript"
			src="/static/extjs/adapter/ext/ext-base.js"></script>
		<script type="text/javascript" src="/static/extjs/ext-all.js"></script>
		<script type="text/javascript" src="/static/extjs/ux/TabCloseMenu.js"></script>
		<script type="text/javascript">
Ext.onReady(function(){
    Ext.QuickTips.init();
	Ext.form.Field.prototype.msgTarget = 'side';
	
    var menuTree = new Ext.tree.TreePanel({
        id:'menu-tree',
        region:'west',
        title:'BlackStar',
        split:true,
        width: 225,
        minSize: 175,
        maxSize: 400,
        collapsible: true,
        margins:'0 0 5 5',
        cmargins:'0 5 5 5',
        rootVisible:false,
        lines:false,
        autoScroll:true,
        root: new Ext.tree.TreeNode('Manage Menu'),
        collapseFirst:false,
		selectNode: function(id){
        	this.getNodeById(id).select();
    	}
    });
    
    
    var mainPanel = new Ext.TabPanel({
        id:'show-panel',
        region: 'center',
        resizeTabs:true, // turn on tab resizing
        minTabWidth: 115,
        tabWidth:135,
        enableTabScroll:true,
        width:900,
		height:'100%',
        defaults: {autoScroll:true}
    });
    mainPanel.on('tabchange', function(panel, tab) {
		panel.doLayout();
	});
    
    var jvmsNode = new Ext.tree.TreeNode({id : 'jvms', text : 'VirtualMachine'});
    menuTree.root.appendChild(jvmsNode);
    var helpNode = new Ext.tree.TreeNode({id : 'help', text : 'Help'});
    helpNode.data = {url : '/static/help.html'};
    menuTree.root.appendChild(helpNode);
            
	var osBaseInfo = {
            xtype : 'fieldset',   
            labelAlign : 'left',
            title : 'OS信息',
            buttonAlign : 'right',
            width : '90%',
            labelWidth : 80,
            items : [{
                        layout : 'column', 
                        border : false,
                        labelSeparator : '：',
                        items : [{
                                    columnWidth : 0.5,
                                    layout : 'form',
                                    border : false,
                                    items : [{ 
                                        xtype : 'label',
                                        fieldLabel : '操作系统',
                                        id : 'osName',
                                        anchor : '90%'
                                    },{ 
                                        xtype : 'label',
                                        fieldLabel : '体系结构',
                                        id : 'osArch',
                                        anchor : '90%'
                                    },{ 
                                        xtype : 'label',
                                        fieldLabel : '版本',
                                        id : 'osVersion',
                                        anchor : '90%'
                                    },{ 
                                        xtype : 'label',
                                        fieldLabel : '处理器数',
                                        id : 'osProcessors',
                                        anchor : '90%'
                                    },{
                                        xtype : 'label',
                                        fieldLabel : '负载',
                                        id : 'osLoadAvarage',
                                        anchor : '90%'
                                    }]
                                }, {
                                    columnWidth : 0.5,
                                    layout : 'form',
                                    border : false,
                                    items : [{ 
                                        xtype : 'label',
                                        fieldLabel : '物理内存总量',
                                        id : 'osTotalMemorySize',
                                        anchor : '90%'
                                    },{ 
                                        xtype : 'label',
                                        fieldLabel : '可用物理内存',
                                        id : 'osFreeMemorySize',
                                        anchor : '90%'
                                    },{ 
                                        xtype : 'label',
                                        fieldLabel : '分配的虚拟内存',
                                        id : 'osVirtualMemorySize',
                                        anchor : '90%'
                                    },{ 
                                        xtype : 'label',
                                        fieldLabel : '交换空间总量',
                                        id : 'osTotalSwapMemorySize',
                                        anchor : '90%'
                                    },{ 
                                        xtype : 'label',
                                        fieldLabel : '可用交换空间',
                                        id : 'osFreeSwapMemorySize',
                                        anchor : '90%'
                                    }]
                                }]
                    }]

        };
    
    var systemPanel = new Ext.Panel({
    				title : '系统信息',
					width:	"100%",
					height:	"100%",
			        items:[{
						  autoScroll : true,
						  enabledTabScroll:true,
			         	  bodyStyle: 'padding:20px;',
			         	  layout:'anchor',
					      region:"center",    
					      items:[osBaseInfo]
					 }]
    			});
    
	mainPanel.add(systemPanel).show();
	mainPanel.doLayout();
	mainPanel.setActiveTab(systemPanel);
    
	function createTab(node) {
    	var comp = mainPanel.getComponent(node.id);
    	if (!comp) {
    		comp = new Ext.Panel({
    				id : node.id,
    				title : node.text,
					width:	"100%",
					height:	"100%",
					html: "<iframe width='98%' height='98%' frameborder='0' scrolling='auto' src='" + node.data.url + "'></iframe>",
					closable : true
    			});
			mainPanel.add(comp).show();
			mainPanel.doLayout();
    	}
    	
    	mainPanel.setActiveTab(comp);
		
    	return comp;
    }
    
    function refreshMenu() {
		Ext.Ajax.request({
			url: 'agent',
			success: function (response,options){
			   	var data = Ext.util.JSON.decode(response.responseText);
				var index;
				var node;
				jvmsNode.removeAll(true);
				for (index=0; index<data.length; index++)
				{
					node = new Ext.tree.TreeNode({id : data[index].id, text : data[index].name});
					node.data = data[index];
					node.data.url = 'jvm/jvm.html?jvmid=' + data[index].id + '&name=' + data[index].name +  '&monitor=' + data[index].monitor + '&performance=' + data[index].performance;
					jvmsNode.appendChild(node);
				}
				jvmsNode.expand();
			},
			failure: function(response,options){
				Ext.MessageBox.alert("Error","加载VM菜单信息出错");
			}
		});
	}
        
    var viewport = new Ext.Viewport({
        layout:'border',
        height:'100%',
        width:'100%',
        items:[
            menuTree,
            mainPanel
         ]
    });    
    
    menuTree.on('click', function(node)
    {
    	if ('jvms' == node.id)
    	{
			refreshMenu();
    	}
 	   	else
 	   	{
 	   		createTab(node);
 	   	}
	});
	
	refreshMenu();    
    
	Ext.Ajax.request({
				url: 'agent/overview',
				success: function (response,options){
				   	var data = Ext.util.JSON.decode(response.responseText);
				   	var cmp;
				   	for (var item in data)
				   	{
				   		cmp = Ext.getCmp(item);
				   		if (cmp)
				   		{
				   			cmp.setText(data[item]);
				   		}
				   	}
				},
				failure: function(response,options){
					Ext.MessageBox.alert("Error","加载VM概要信息出错");
				}
		});
});

        </script>
	</head>

	<body style="padding: 10px;"></body>
</html>